<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>助力梦想</title>
    <style>
        * {
            padding: 0;
            margin: 0;
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

        a {
            -webkit-touch-callout: none;
            -webkit-tap-highlight-color: rgba(255, 0, 0, 0);

        }

        .container {
            width: 100%;
            max-width: 7.5rem;
            margin: 0 auto;
            background: #FFDC8C;
            position: relative;
            padding-bottom: 0.68rem;
            margin-top: -30px;
        }

        .container .header {
            width: 7.5rem;
            height: 11.18rem;
            position: relative;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/header-bg.jpg");
            background-size: cover;
        }

        .container .body {
            width: 6.7rem;
            margin: -4.72rem auto 0;
        }

        .container .body .title {
            width: 6.06rem;
            height: 1.02rem;
            margin: 0 auto;
            position: relative;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/title-bg.png");
            background-size: cover;
            z-index: 2;
            font-size: 0.38rem;
            color: #ffffff;
            font-weight: 500;
            line-height: 1.02rem;
            text-align: center;
        }

        .container .body .content {
            width: 6.7rem;
            background: #ffffff;
            border-radius: 0.2rem;
            position: relative;
            margin-top: -0.37rem;
            padding-top: 0.76rem;
            padding-bottom: 0.6rem;
            overflow: hidden;
        }

        .container .body .content .success-tips {
            width: 100%;
            height: 0.34rem;
            font-size: 0.24rem;
            font-weight: 400;
            color: #F88F3A;
            line-height: 0.34rem;
            text-align: center;
            overflow: hidden;
        }

        .container .body .content .success-tips ul {
            width: 100%;
            list-style: none;
            position: relative;
        }

        .container .body .content .op-tips {
            width: 100%;
            text-align: center;
            line-height: 0.34rem;
            font-size: 0.24rem;
            color: #333333;
            font-weight: 400;
            margin-top: 0.48rem;
        }

        .container .body .content .button {
            width: 5.02rem;
            height: 1.04rem;
            margin: 0.4rem auto 0.46rem;
            background-size: cover;
        }

        .container .body .content .button.invite {
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/button-bg.png");
        }

        .container .body .content .button.help {
            width: 3.9rem;
            height: 1.04rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/help.png");
        }

        .container .body .content .button.helped {
            width: 3.9rem;
            height: 1.04rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/helped.png");
        }

        .container .body .content .button.can-received {
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/can-received.png");
        }

        .container .body .content .button.all-received {
            width: 3.5rem;
            height: 1.04rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/all-received.png");
        }

        .container .body .content .button:active {
            /*background-image: none;*/
            /*background-position: 0 10px;*/
            /*transform: rotateY(180deg);*/
            /*transform: skew(5deg, 0deg);*/
        }

        .container .body .content .line {
            width: 4.4rem;
            height: 0;
            border-top: 0.02rem solid #979797;
            margin: 0 auto;
        }

        .content .progress {
            position: relative;
            margin-top: 0.36rem;
            padding: 0.52rem 0;
        }

        .progress-content-bg {
            height: 0.14rem;
            position: relative;
            background: #F57A4C;
            border-radius: 0.07rem;
        }

        .content .progress .progress-tips {
            /*position: absolute;*/
        }

        .content .progress .progress-tips span {
            width: 1.21rem;
            height: 0.34rem;
            font-size: 0.24rem;
            color: #666666;
            font-weight: 400;
            position: absolute;
            bottom: 0;
        }

        .content .progress .progress-tips span:nth-child(odd) {
            position: absolute;
            top: 0;
        }

        .content .progress .progress-tips .received {
            color: #c2c2c2;
        }

        .content .progress .progress-tips .unreceived {
            color: #F88F3A;
        }

        .content .progress .progress-content {
            width: 5.3rem;
            height: 0.14rem;
            position: relative;
            margin: 0 auto;
            background: #FCDACE;
            border-radius: 0.07rem;
        }

        .content .progress .progress-content .progress-content-points {

        }

        .content .progress .progress-content .progress-content-points span {
            width: 0.1rem;
            height: 0.1rem;
            border-radius: 50%;
            background: #F3B1A0;
            position: absolute;
            top: 0.02rem;
            margin-left: -0.11rem;
        }

        .content .progress .progress-content .progress-cur {
            width: 0.28rem;
            height: 0.28rem;
            border-radius: 50%;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/circle.png");
            background-size: cover;
            position: absolute;
            left: 0;
            top: -0.07rem;
            margin-left: -0.2rem;
            /*display: none;*/
        }

        .container .body .content .list {
            width: 5.58rem;
            margin: 0 auto;
            padding-top: 0.36rem;
        }

        .container .body .content .list .all-title {
            display: none;
            text-align: center;
            color: #333333;
            font-size: 0.24rem;
        }

        .list-avatar .left {
            float: left;
            display: block;
            font-size: 0.28rem;
            color: #333333;
            font-weight: 500;
        }

        .list-avatar .right {
            float: right;
            display: block;
            font-size: 0.24rem;
            color: #999999;
            font-weight: 400;
        }

        .list-avatar .collapse {
            display: none;
        }

        .list-avatar .list-avatar-area {
            width: 100%;
            height: 0.64rem;
            display: block;
            overflow: hidden;
            padding-top: 0.24rem;
            list-style: none;
            text-align: center;
        }

        .list-avatar .list-avatar-area .list-avatar-item {
            display: inline-block;
            width: 0.64rem;
            height: 0.64rem;
            margin: 0 0.2rem;
            border-radius: 50%;
            overflow: hidden;
        }

        .list-avatar .list-avatar-area .list-avatar-item img {
            width: 0.64rem;
            height: 0.64rem;
            border-radius: 50%;
            overflow: hidden;
        }

        .list.all-list .left, .list.all-list .right {
            display: none;
        }

        .container .body .content .list.all-list .all-title {
            display: block;
        }

        .list.all-list .collapse {
            display: block;
            width: 0.6rem;
            height: 0.22rem;
            margin: 0.2rem auto 0;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/collapse.png");
            background-repeat: no-repeat;
            background-size: cover;
        }

        .list.all-list .list-avatar-area {
            height: auto;
        }

        .list.all-list .list-avatar-area .list-avatar-item {
            width: 100%;
            height: 0.36rem;
            line-height: 0.36rem;
            margin: 0.1rem 0 0;
            font-size: 0.24rem;
            overflow: visible;
            color: #999999;
        }

        .list.all-list .list-avatar-area .list-avatar-item img {
            width: 0.36rem;
            height: 0.36rem;
            /*display: inline-block;*/
            display: inline;
            float: left;
        }

        .list.all-list .list-avatar-area .list-avatar-item .friend-name {
            display: inline-block;
            float: left;
            margin-left: 0.16rem;
        }

        .list.all-list .list-avatar-area .list-avatar-item .friend-tips {
            display: inline-block;
            float: right;
        }

        .footer {
            width: 5.58rem;
            padding: 0.56rem;
            background: #FFB818;
            border-radius: 0.2rem;
            margin: 0.52rem auto 0;
            color: #ffffff;
            font-size: 0.24rem;
            line-height: 0.34rem;
            overflow: hidden;
        }

        .footer .title {
            width: 3.24rem;
            height: 0.5rem;
            margin: 0 auto;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/rule-bg.png");
            background-size: cover;
            min-width: 3.24rem;
        }

        .footer .content {
            padding-top: 0.32rem;
        }

        #mask {
            position: fixed;
            top: 0;
            bottom: 0;
            left: 0;
            right: 0;
            background: rgba(0, 0, 0, 0.5);
            z-index: 9;
            overflow: hidden;
            display: none;
        }

        #mask-window {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            z-index: 10;
            display: none;
        }

        .coupon {
            width: 7.42rem;
            margin: 3.5rem auto 0;
            height: 4.38rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/coupon-bg.png");
            background-size: cover;
            text-align: center;
            color: #ffffff;
            font-size: 1.12rem;
            font-weight: 500;
            line-height: 4rem;
        }

        .coupon .discount {
            font-size: 1.44rem;
            display: inline;
        }

        .coupon .use-button {
            width: 2.8rem;
            height: 0.84rem;
            margin: -0.2rem auto 0;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/use.png");
            background-size: cover;
            display: block;
            text-indent: 999px;
        }

        .coupon .coupon-close {
            width: 0.44rem;
            height: 0.44rem;
            margin: 0.48rem auto;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/close.png");
            background-size: cover;
        }

        .login {
            width: 4.2rem;
            margin: 2.42rem auto 0;
            background: #ffffff;
            border-radius: 0.2rem;
            padding: 0.54rem 0.44rem;
            position: relative;
        }

        .login .login-title {
            text-align: center;
            font-size: 0.28rem;
            font-weight: 500;
            color: #333333;
        }

        .login .mobile {
            margin-top: 0.38rem;
            position: relative;
        }

        .login .mobile .phone-num {
            width: 3.8rem;
            height: 0.24rem;
            line-height: 0.24rem;
            text-indent: 1.06rem;
            border: 0.02rem solid #E7E7E7;
            border-radius: 0.08rem;
            font-size: 0.24rem;
            padding: 0.28rem 0.2rem;
            user-select: text;
            -webkit-user-select: text;
            outline: none;
        }

        .login .mobile .area-code-select {
            width: 0.44rem;
            height: 0.34rem;
            padding: 0.03rem 0.2rem;
            font-size: 0.24rem;
            color: #333333;
            line-height: 0.34rem;
            font-weight: 400;
            position: absolute;
            top: 0.22rem;
            left: 0.05rem;
            border-right: 0.02rem solid #e7e7e7;
        }

        .login .code {
            margin-top: 0.14rem;
            position: relative;
        }

        .login .code .verify-code {
            width: 3.8rem;
            max-width: 100%;
            height: 0.24rem;
            line-height: 0.24rem;
            border: 0.02rem solid #E7E7E7;
            border-radius: 0.08rem;
            font-size: 0.24rem;
            padding: 0.28rem 0.2rem;
            user-select: text;
            -webkit-user-select: text;
            outline: none;
        }

        .login .code .get-verify-code {
            position: absolute;
            right: 0;
            top: 0.22rem;
            width: auto;
            height: 0.36rem;
            line-height: 0.36rem;
            padding: 0.04rem 0.2rem 0.04rem 0.3rem;
            border-left: 0.02rem solid #e7e7e7;
            font-size: 0.24rem;
            color: #00D8D3;
        }

        .login .code .get-verify-code.done {
            color: #9c9c9c;
        }

        .login .code .get-verify-code:active {
            /*-webkit-tap-highlight-color: #fff;*/
        }

        .login .mobile .phone-num:focus, .login .code .verify-code:focus {
            border-color: #00D8D3;
            /*-webkit-appearance: none;*/
        }

        .login .login-button {
            width: 100%;
            height: 0.8rem;
            border: none;
            border-radius: 0.08rem;
            font-size: 0.28rem;
            line-height: 0.8rem;
            text-align: center;
            margin-top: 0.34rem;
            background: #00D8D3;
            color: #ffffff;
        }

        .login .login-button.login-disabled {
            background: #e7e7e7;
            color: #9c9c9c;
        }

        .login .privacy {
            width: 100%;
            line-height: 0.28rem;
            color: #9c9c9c;
            font-size: 0.2rem;
            font-weight: 400;
            margin-top: 0.14rem;
        }

        .login .privacy-agree {
            position: relative;
            top: 0.03rem;
        }

        input[type="checkbox"] {
            outline: none;
        }

        input[type="checkbox"]::before {
            content: "";
            position: absolute;
            top: -1.5px;
            left: -1.5px;
            background: #fff;
            width: 100%;
            height: 100%;
            border: 1px solid #cecece;
        }

        input[type="checkbox"]:checked::before {
            content: "";
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/checked-true.png");
            background-size: cover;
            border-color: #00d3cc;
        }

        .login .privacy a {
            color: #188BCE;
            text-decoration: none;
            margin-top: 0.34rem;
        }

        .login .login-close {
            width: 0.32rem;
            height: 0.32rem;
            display: block;
            position: absolute;
            right: 0.2rem;
            top: 0.2rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/login-close.png");
            background-size: cover;
        }

        .login input::-webkit-input-placeholder, .login input:-moz-placeholder, .login input::-moz-placeholder, .login input:-ms-input-placeholder {
            color: #c0c0c0;
            font-size: 0.24rem;
        }

        .loading {
            width: 5.8rem;
            height: 4.35rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/loading.gif");
            background-size: cover;
            margin: 0 auto;
        }

        .help-success {
            position: relative;
            margin-top: 2.5rem;
        }

        .help-success .info {
            width: 7.5rem;
            height: 4.38rem;
            text-align: center;
            line-height: 4.65rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/help-success-info.png");
            background-size: cover;
            color: #ffffff;
            font-size: 0.76rem;
            letter-spacing: 0.08rem;
            font-weight: 500;
            position: relative;
            z-index: 3;
            margin: 0 auto;
        }

        .help-success .desc {
            width: 6.7rem;
            position: relative;
            z-index: 2;
            background: #ffffff;
            border-radius: 0.2rem;
            margin: 0 auto;
            text-align: center;
            top: -2rem;
            padding-top: 1.58rem;
            padding-bottom: 0.46rem;
            line-height: 0.48rem;
            color: #fa8028;
            letter-spacing: 1px;
            font-size: 0.24rem;
            font-weight: 400;
        }

        .help-success .desc a {
            width: 4.4rem;
            height: 0.84rem;
            display: block;
            margin: 0.46rem auto 0;
            text-decoration: none;
            text-indent: 999rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/help-success-button.png");
            background-size: cover;
        }

        .help-success .close {
            width: 0.44rem;
            height: 0.44rem;
            margin: -1.6rem auto 0;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/close.png");
            background-size: cover;
        }

        #download {
            width: 7.5rem;
            height: 1.2rem;
            margin: 0 auto;
            position: fixed;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.6);
        }

        #download .close {
            width: 0.32rem;
            height: 0.32rem;
            margin: 0.44rem 0.2rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/close.png");
            background-size: cover;
            float: left;
        }

        #download .logo {
            width: 0.98rem;
            height: 1rem;
            margin: 0.1rem 0 0.1rem;
            background-image: url("https://oss.goddessxzns.com/active/ac20210610/logo.png");
            background-size: cover;
            float: left;
        }

        #download .tips {
            height: 1.2rem;
            line-height: 1.2rem;
            font-size: 0.28rem;
            font-weight: 400;
            color: #ffffff;
            margin-left: 0.18rem;
            float: left;
        }

        #download .button {
            padding: 0 0.28rem;
            height: 1.2rem;
            line-height: 1.2rem;
            color: #ffffff;
            font-size: 0.32rem;
            font-weight: 500;
            background: #6478FF;
            float: right;
            text-align: center;
            text-decoration: none;
        }
    </style>
    <script src="{$oss}/active/newyear/js/rem.js"></script>
</head>
<body>
<div class="container">
    <!--头图背景-->
    <div class="header"></div>
    <!--主要内容-->
    <div class="body">
        <div class="title">{if $app_type !== 'web'}我的助力进度{else}为ta助力{/if}</div>
        <div class="content">
            {if !empty($data['history_list'])}
            <div class="success-tips">
                <ul>
                    {foreach $data['history_list'] as $k => $v}
                    <li>恭喜{$v['nickname']}领取{$v['cname']}！</li>
                    {/foreach}
                </ul>
            </div>
            {/if}
            <div class="op-tips">{if $app_type !== 'web'}成功邀请好友即可获得对应数量的助力值～{else}一键帮你的小伙伴提高助力值～{/if}</div>
            <div class="progress">
                <div class="progress-tips">
                    <span>助力值10</span>
                    <span>助力值30</span>
                    <span>助力值50</span>
                    <span>助力值70</span>
                    <span>助力值90</span>
                    <span>助力值100</span>
                </div>
                <div class="progress-content">
                    <div class="progress-content-bg"></div>
                    <div class="progress-content-points">
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                        <span></span>
                    </div>
                    <div class="progress-cur"></div>
                </div>
            </div>
            <div class="button {if $app_type === 'web'}{if $isAssist}helped{else}help{/if}{else}invite{/if}"></div>
            <div class="line" style="{if empty($data['add_list'])}display:none;{/if}"></div>
            <div class="list list-avatar" style="{if empty($data['add_list'])}display:none;{/if}">
                <div class="left">好友助力</div>
                <div class="right show-all">查看全部</div>
                <div class="all-title">当前已为{if $app_type === 'web'}ta{else}你{/if}助力成功的好友</div>
                <ul class="list-avatar-area">
                    {foreach $data.add_list as $k => $v}
                    <li class="list-avatar-item">
                        <img src="{if strpos($v['avatar'],'http')===false}{$oss}{/if}{$v['avatar']}" alt="默认头像">
                        <span class="friend-name">{$v['name']}</span>
                        <span class="friend-tips">助力成功{if $v['score'] < 10}&nbsp;&nbsp;{/if}+{$v['score']}</span>
                    </li>
                    {/foreach}
                </ul>
                <div class="collapse"></div>
            </div>
        </div>
    </div>
    <!--活动规则-->
    <div class="footer">
        <div class="title"></div>
        <div class="content">
            <p>1、活动期间每天可将活动分享到微信好友，朋友圈，QQ好友，QQ空间邀请好友助力。点击助力，即可获得随机助力值。</p>
            <br>
            <p>
                2、助力值随机发放，集满10助力值即可以获得一生报告9折券，集满30助力值即可获得一生报告8.5折券，集满50助力值即可获得一生报告8折券，集满70助力值即可获得一生报告7.5折券，集满90助力值即可获得一生报告7折券，集满100助力值即可获得一生报告6折券。</p>
            <br>
            <p>3、活动期间各阶段优惠券仅可领取一次。</p>
            <br>
            <p>4、如出现违规行为（如作弊领取等）将取消用户的活动资格，同时收回相关优惠券。</p>
            <br>
            <p>5、活动发起者无法为本人助力。且每位好友在活动期间只可为同一人助力一次。</p>
            <br>
            <p>6、活动期间每日助力值可保留至领取相应阶段的优惠券为止。</p>
            <br>
            <p>7、优惠券7日内有效。</p>
        </div>
    </div>
    {if $app_type === 'web'}
    <script src="https://static.jmlk.co/scripts/dist/jmlink.min.js"></script>
    <div id="download">
        <div class="close" id="download-close"></div>
        <div class="logo"></div>
        <div class="tips">启动APP体验更多精彩！</div>
        <a class="button" href="https://a0ue2y.jmlk.co/AA63" data-jmlink="true" data-auto="false" data-params="{a: 1}">打开APP</a>
    </div>
    <script>
        document.getElementById('download-close').onclick = function () {
            document.getElementById('download').style.display = 'none';
        }
    </script>
    {/if}
    <div id="mask"></div>
    <div id="mask-window"></div>
</div>
{include file="../apps/web/view/public/sensors.html" /}
<script src="{$oss}active/seven/js/jquery-v2.1.1.min.js"></script>
<script>
    $(function () {
        var progressDom = $('.progress').eq(0), my_score = '{$data.my_score}';
        my_score = my_score > 100 ? 100 : my_score;
        var maxWidth = $('.content .progress .progress-content').width(), perWidth = maxWidth / 100;
        var levelsHtml = '', progressTipsHtml = '';
        var score_list = JSON.parse('{:json_encode($data.score_list)}'), isRecivedButton = false, receivedNum = 0;
        window.app_type = '{$app_type}';
        const shareTitle = '{$share_info.title}';
        const shareMessage = '{$share_info.message}';
        const shareUrl = '{$share_info.url}';
        const htmlFontSize = parseInt($('html').css('fontSize'));
        var loadings = {
            coupon: false,// 领取优惠券
            code: false,// 获取验证码
            login: false,// 验证登录
            help: false,// 为ta助力
        }, soId = parseInt('{$so_id}');
        setProgress();
        // 邀请好友助力
        $('.invite').click(function () {
            console.log('准备邀请好友进行助力...')
            // 调起APP本地分享
            commonJsToNativeShare(shareTitle, shareMessage, shareUrl, 5);
        })
        // 为ta助力
        $('.help').click(function () {
            if (loadings.help === true) {
                return false;
            }
            console.log('准备给好友进行助力...')
            $.ajax({
                url: '{:url("activeHelp")}',
                type: 'POST',
                dateType: 'json',
                data: {soid: soId},
                beforeSend: function () {
                    console.log('help before')
                    loadings.help = true;
                },
                success: function (res) {
                    if (res.code === 403) {
                        // toast(res.msg)
                        showLoginHtml();
                    } else if (res.code === 200) {
                        console.log('help success')
                        // 展示助力成功窗口
                        showhelpSuccessHtml(res.data.score);
                        // 助力成功后，按钮修改为助力成功！
                        $('.container .body .content .button').removeClass('invite can-received all-received help helped').addClass('helped');
                    } else {
                        toast(res.msg)
                    }
                },
                complete: function () {
                    loadings.help = false;
                    console.log('help complete')
                },
                error: function (err) {
                    loadings.help = false;
                    toast('网络异常，请稍后重试～')
                    console.log(err.responseText)
                }
            })
            return false;
        })
        // 领取优惠券
        $('.can-received').click(function () {
            if (loadings.coupon === true) {
                console.log('禁止连续点击领取优惠券')
                return false;
            }
            console.log('点击领取优惠券...')
            $.ajax({
                url: '/api/v26/active/give_coupon',
                type: 'POST',
                dataType: 'json',
                data: {},
                headers: {$headers},
                beforeSend: function () {
                    loadings.coupon = true;
                },
                success: function (res) {
                    if (res.code === 200) {
                        // 显示领取到的优惠券
                        showCouponRecivedHtml(res.data.discount);
                        for (var i = 0; i < score_list.length; i++) {
                            // 将第一个待领取的修改为已领取
                            if (!parseInt(score_list[i]['is_get_coupon'])) {
                                score_list[i]['is_get_coupon'] = 1;
                                break;
                            }
                        }
                        setProgress();
                        console.log(res.msg)
                    } else {
                        toast(res.msg)
                        console.error(res.msg)
                    }
                },
                complete: function () {
                    loadings.coupon = false;
                },
                error: function (err) {
                    // toast('网络异常，请稍后重试～')
                    toast(err.responseText)
                    console.log(err.responseText)
                }
            })
            return false;
        })
        // 查看全部
        $('.show-all').click(function () {
            console.log('查看全部...')
            $(this).parent().addClass('all-list');
        })
        // 仅展示前五位助力人头像
        $('.collapse').click(function () {
            console.log('收起...')
            $(this).parent().removeClass('all-list');
        })
        const maskWindow = $('#mask-window');
        // 收起遮罩
        maskWindow.on('click', '.close', function () {
            maskWindow.html('').hide();
            $('#mask').hide();
        })
        // 获取验证码
        maskWindow.on('click', '.get-code', function () {
            if (loadings.code === true) {
                // console.log('禁止连续点击获取验证码');
                return false;
            }
            var telDom = $('.login-form input[name=tel]'), tel = telDom.val(),
                area_code = $('.login-form input[name=area_code]').val(),
                thisObj = $(this);
            if (tel.length !== 11 || !/1[3-9]\d{9}/.test(tel)) {
                toast('手机号错误');
                console.log('手机号错误');
                telDom.focus();
                return false;
            }
            var getCodeLimitSecond = 60;
            $.ajax({
                url: '{:url("getCode")}',
                type: 'POST',
                dataType: 'json',
                data: {'tel': tel, area_code: area_code},
                beforeSend: function () {
                    // maskWindow.append('<div class="loading"></div>')
                    loadings.code = true;
                },
                success: function (res) {
                    if (res.code === 200) {
                        // 验证码获取成功
                        maskWindow.find('.verify-code').val('');
                        var getCodeTimer = setInterval(function () {
                            if (getCodeLimitSecond <= 0) {
                                getCodeLimitSecond = 60;
                                thisObj.removeClass('done').text('获取验证码');
                                clearInterval(getCodeTimer);
                                loadings.code = false;
                            } else {
                                thisObj.addClass('done').text(getCodeLimitSecond + 's 后重新获取');
                                getCodeLimitSecond--;
                            }
                        }, 1000)
                        console.log(res.msg)
                    } else {
                        toast(res.msg)
                        loadings.code = false;
                        console.error(res.msg)
                    }
                },
                complete: function () {

                },
                error: function (err) {
                    toast('网络异常，请稍后重试～')
                    loadings.code = false;
                    console.log(err.responseText)
                }
            })
            return false;
        })
        // 同意/不同意 用户协议和隐私政策
        maskWindow.on('change', '.privacy-agree', function () {
            // console.log($(this).is(':checked'));
            if ($(this).is(':checked')) {
                maskWindow.find('.login-button').removeClass('login-disabled');
            } else {
                maskWindow.find('.login-button').addClass('login-disabled');
            }
        })
        // 点击"验证登录按钮"
        maskWindow.on('click', '.login-button', function () {
            if ($(this).hasClass('login-disabled')) {
                toast('请先阅读并同意协议和隐私政策');
                console.log('请先阅读并同意协议和隐私政策');
                return false;
            }
            if (loadings.login === true) {
                return false;
            }
            console.log('准备登录...')
            // 检测手机号是否填写
            var postData = {
                tel: $('.login-form input[name=tel]').val(),
                area_code: $('.login-form input[name=area_code]').val(),
                code: $('.login-form input[name=code]').val(),
                so_id: $('.login-form input[name=so_id]').val(),
                privacy: $('.login-form input[name=privacy]').is(':checked'),
            }
            // console.log('postData :', postData)
            if (postData.tel.length !== 11 || !/1[3-9]\d{9}/.test(postData.tel)) {
                toast('手机号错误');
                console.log('手机号错误');
                return false;
            }
            // 检测验证码是否已填写
            if (postData.code.length !== 6 || !/\d{6}/.test(postData.code)) {
                toast('短信验证码错误');
                console.log('短信验证码错误');
                return false;
            }
            // 检测是否已阅读并同意协议和隐私政策
            if (!postData.privacy) {
                toast('请先阅读并同意协议和隐私政策');
                console.log('请先阅读并同意协议和隐私政策');
                return false;
            }
            $.ajax({
                url: '{:url("acLogin20210610")}',
                type: 'POST',
                dataType: 'json',
                data: postData,
                beforeSend: function () {
                    loadings.login = true;
                },
                success: function (res) {
                    if (res.code === 200) {
                        $('#mask').hide();
                        maskWindow.html('').hide();
                        console.log('login success: ', res);
                    } else {
                        toast(res.msg)
                        console.log('login failed: ', res);
                    }
                },
                complete: function () {
                    loadings.login = false;
                },
                error: function (err) {
                    toast('网络异常，请稍后重试～')
                    console.log(err.responseText)
                }
            })
            return false;
        })

        scrollSuccessTipsList();
        function scrollSuccessTipsList() {
            var areaDom = $('.success-tips');
            var count = 1, scrollItemHeight = areaDom.find('li').height();
            setInterval(function () {
                if (count >= areaDom.find('li').length) {
                    areaDom.find('ul').css('top', scrollItemHeight )
                    count = 1;
                }
                areaDom.find('ul').animate({'top': parseFloat(areaDom.find('ul').eq(0).css('top')) - scrollItemHeight}, 1500)
                count++;
            }, 5000)
        }

        // 重置助力值进度
        function setProgress() {
            isRecivedButton = false;
            receivedNum = 0;
            for (var i = 0; i < score_list.length; i++) {
                var value = score_list[i].score, className1 = '', styleSheet1 = '', className2 = '', styleSheet2 = '';
                styleSheet1 = my_score >= value ? 'background: #ffffff;z-index : 3;' : '';
                styleSheet1 += 'left: ' + (perWidth * value / htmlFontSize) + 'rem;';
                levelsHtml += '<span style="' + styleSheet1 + '"></span>';
                progressTipsHtml += '<span ';
                styleSheet2 += 'left: ' + (perWidth * value / htmlFontSize) + 'rem';
                if (my_score >= value) {
                    if (app_type !== 'web') {
                        className2 = parseInt(score_list[i]['is_get_coupon']) ? 'received' : 'unreceived';
                    }
                    if (!parseInt(score_list[i]['is_get_coupon'])) {
                        isRecivedButton = true;
                    } else {
                        receivedNum++;
                    }
                }
                progressTipsHtml += ' class="' + className2 + '"';
                progressTipsHtml += ' style="' + styleSheet2 + '"';
                progressTipsHtml += '>助力值' + value + '</span>';
            }
            progressDom.find('.progress-content-points').eq(0).html(levelsHtml);
            progressDom.find('.progress-tips').eq(0).html(progressTipsHtml);
            progressDom.find('.progress-content-bg').eq(0).css({width: (perWidth * my_score / htmlFontSize) + 'rem'});
            progressDom.find('.progress-cur').eq(0).css({left: (perWidth * my_score / htmlFontSize) + 'rem'});
            // 在APP内访问
            if (app_type !== 'web') {
                if (receivedNum >= score_list.length) {
                    // 助力完成，且领取完成
                    $('.container .body .content .button').removeClass('invite can-received all-received help helped').addClass('all-received');
                } else if (isRecivedButton === true) {
                    // 有待领取的优惠券
                    $('.container .body .content .button').removeClass('invite can-received all-received help helped').addClass('can-received');
                } else {
                    // 显示邀请按钮
                    $('.container .body .content .button').removeClass('invite can-received all-received help helped').addClass('invite');
                }
            } else {
                if (my_score >= 100) {
                    $('.container .body .content .button').removeClass('invite can-received all-received help helped').addClass('all-received');
                }
            }
        }

        // 展示领取到的优惠券
        function showCouponRecivedHtml(data) {
            data = (typeof data === 'undefined') ? '1' : data;
            var htmlStr = '<div class="coupon">' +
                '   <div class="coupon-info"><span class="discount">' + (data * 10) + '</span><span style="position: relative;top: -0.15rem;">折</span></div>\n' +
                '   <a class="use-button" href="{$mhost}/report_index?need_auth=1" target="_blank"> </a>\n' +
                '   <div class="close coupon-close"></div>' +
                '</div>';
            $('#mask').show();
            maskWindow.html(htmlStr).show();
        }

        // 展示登录窗口
        function showLoginHtml() {
            console.log('拉起登录框...');
            var htmlStr = '<div class="login login-form">\n' +
                '            <div class="login-title">登录帮好友助力解锁更多精彩</div>\n' +
                '            <div class="mobile">\n' +
                '                <input type="tel" class="phone-num" name="tel" placeholder="请输入手机号" autocomplete="off" value="">\n' +
                '                <input type="hidden" class="area-code" name="area_code" value="86" readonly>\n' +
                '                <div class="area-code-select">+86</div>\n' +
                '            </div>\n' +
                '            <div class="code">\n' +
                '                <input type="tel" class="verify-code" name="code" placeholder="请输入验证码" autocomplete="off" minlength="6" maxlength="6">\n' +
                '                <div class="get-verify-code get-code">获取验证码</div>\n' +
                '            </div>\n' +
                '            <input type="hidden" name="so_id" value="{$so_id}" readonly>\n' +
                '            <div class="privacy">\n' +
                '                <input type="checkbox" class="privacy-agree" name="privacy"> 我已阅读并同意<a href="{$host}/web/service.html">用户协议</a>和<a\n' +
                '                    href="{$host}/web/privacy.html">隐私政策</a>\n' +
                '            </div>\n' +
                '            <button type="submit" class="login-button login-disabled">验证登录</button>\n' +
                '            <div class="close login-close"></div>\n' +
                '        </div>';
            $('#mask').show();
            maskWindow.html(htmlStr).show();
            maskWindow.find('input[name=tel]').focus();
        }

        // 展示助力成功提示窗口
        function showhelpSuccessHtml(data) {
            data = (typeof data === 'undefined') ? '10' : data;
            var htmlStr = '<div class="help-success">\n' +
                '            <div class="info">助力值+' + data + '</div>\n' +
                '            <div class="desc">\n' +
                '                <p>想深入揭秘你和TA的未来发展情况吗？</p>\n' +
                '                <p>想知道你的家庭姻缘吗？</p>\n' +
                '                <p>想了解你未来的财富高度吗？</p>\n' +
                '                <p>想知道你的事业前途吗？</p>\n' +
                '                <p>想了解你的专业学科吗？</p>\n' +
                '                <a href="{$mhost}/report_index?need_auth=1" target="_blank"></a>\n' +
                '            </div>\n' +
                '            <div class="close"></div>\n' +
                '        </div>';
            $('#mask').show();
            maskWindow.html(htmlStr).show();
        }

        /**
         * 提示错误信息
         * @param msg
         */
        function toast(msg) {
            var res = '<div class="message-box" style="width: 100%;position: fixed;bottom: 3.72rem;text-align: center;display: block;z-index: 1000;">\n' +
                '        <div class="message" style="display: inline-block;font-size: 0.28rem;padding: 0.14rem 0.26rem;border-radius: 0.18rem;background-color: #6F6F6F;color: white;">' + msg + '</div>\n' +
                '    </div>', messageBox = $('.message-box');
            if (messageBox.length > 0) {
                messageBox.remove();
            }
            $('body').append(res);
            clearTimeout(window.timer2);
            window.timer2 = setTimeout(function () {
                $('.message-box').remove();
            }, 2500);
        }

        /**
         * 调起APP本地分享
         * commonJsToNativeShare(title,desc,**url,platform[0：微信；1：微信朋友圈；2：微博；3：qq；4：qq空间]);【注意：banner 跳转的webview 和 服务消息里跳转的webview  要实现的js调用本地分享的方法】
         * @param title
         * @param desc
         * @param url
         * @param platform
         */
        function commonJsToNativeShare(title, desc, url, platform) {

            switch (app_type) {
                case 'ios':
                    window.webkit.messageHandlers.commonJsToNativeShare.postMessage({
                        'title': title,
                        'desc': desc,
                        'url': url,
                        'platform': platform,
                        'umeng_event_name': '',
                        'umeng_event_label': ''
                    });
                    break;
                case 'android':
                    console.log('android')
                    androidwebview.commonJsToNativeShare(title, desc, url, platform, '', '')
                    break;
                default:
                    console.log('which app type ' + app_type + ' was unsupported!')
            }
        }
    })
</script>
</body>
</html>
